<template>
	<div class="wrapper" style="padding-top: 10px;">
		<!-- <u-navbar class="navbar" :is-back="false" :is-fixed="true">
			<img src="../../../../static/tabbar/home-s1.png" @click="navigateTo('/pages/tabbar/home/index', 'switch')">
		</u-navbar> -->
		<view>
			<view class="nav_list" v-for="(item, index) in tabList" :key="item.id"
				:class="{ active: item.id === currentId }" @click="onPageJump(index)">
				{{ item.name }}
			</view>
			<!-- <view class="nav_list" @click="onPageJump(0)">
			<image src="../../../../static/swiper/navibar-logo.png" mode="aspectFit"></image>
			<text>{{ tabList[0].name }}</text>
		</view> -->
		</view>
	</div>



	<!-- <div class="nav_list"  >
		
	</div> -->

	<!-- <z-navigation></z-navigation> -->
</template>

<script>
import { getCategoryList } from "@/api/goods.js";
export default {
	data() {
		return {
			currentId: 0,
			tabList: [], //左侧标题列表
			categoryList: [], //右侧分类数据列表
			topImg: "", //顶部图片
		};
	},
	created() {
		this.loadData();
		uni.hideTabBar();
	},
	//第一次加载
	onLoad(e) {
		// 隐藏原生的tabbar
		uni.hideTabBar();
		this.loadData();
	},
	//页面显示
	onShow() {
		// 隐藏原生的tabbar
		uni.hideTabBar();
	},
	//方法
	methods: {
		async loadData() {
			let list = await getCategoryList(0);
			this.tabList = list.data.result;
			this.currentId = list.data.result[0].id;
			this.loadListContent(0);
		},
		/**
	 * 加载列表内容
	 */
		loadListContent(index) {
			this.topImg = this.tabList[index];
			this.categoryList = this.tabList[index].children;
		},
		/**
	 * 一级分类点击
	 */
		tabtap(item, i) {
			if (item.id != this.currentId) {
				this.currentId = item.id;
				this.loadListContent(i);
			}
		},
		onPageJump(index) {
			this.loadListContent(index);
			let data = encodeURIComponent(JSON.stringify(this.categoryList));
			/**common2接受**/
			uni.setStorageSync("commonMenu", data);
			uni.navigateTo({
				url: '/pages/tabbar/home/template/commonH1'
			});
		},
		onTokenJump(url) {
			this.judgeLogin(() => {
				uni.navigateTo({
					url: url
				});
			});
		},
		onPrivacyAgreement() {
			// #ifdef H5
			window.open("https://ask.dcloud.net.cn/article/36937");
			// #endif
			// #ifndef H5
			this.$store.commit("setWebViewUrl", "https://ask.dcloud.net.cn/article/36937");
			uni.navigateTo({
				url: '/pages/template/webView'
			});
			// #endif
		}
	},
	//页面隐藏
	onHide() { },
	//页面卸载
	onUnload() { },
	//页面下来刷新
	onPullDownRefresh() { },
	//页面上拉触底
	onReachBottom() { },
	//用户点击分享
	onShareAppMessage(e) {
		return this.wxShare();
	}
};
</script>
<style lang="scss" scoped>
@import '@/style/mixin.scss';

.nav_list {
	background-color: #fff;
	// padding: 30upx;
	padding-left: 25px;
	padding-bottom: 10px;
	// padding-left: 40px;
	display: flex;
	align-items: center;
	position: relative;
	// margin-bottom: 0upx;
	// top: 228px;
	// width: 400px;
	font-size: 20upx;

	// width: -webkit-fill-available;
	&:active {
		background-color: #f5f5f5;
	}

	image {
		width: 40upx;
		height: 40upx;
	}

	text {
		font-size: 28upx;
		color: #333;
		margin-left: 30upx;
	}

	// &::after {
	// 	content: '';
	// 	position: absolute;
	// 	// right: 30upx;
	// 	left: 300px;
	// 	top: 50%;
	// 	transform: translateY(-50%);
	// 	width: 40upx;
	// 	height: 40upx;
	// 	background-image: url('');
	// 	background-position: center center;
	// 	background-repeat: no-repeat;
	// 	background-size: cover;
	// }
}

// .time {
// 	padding: 20upx 30upx;
// 	font-size: 24rpx;
// 	color: #666;
// }
</style>
